<template>
  <div class="tabbar">
    <span :class="{colorful:cIndex==index}" @click="choose(index)" v-for='(item,index) in list' :key=index>{{item}}</span>
  </div>
</template>

<script>
export default {
    data(){
        return{
            cIndex:0,
            list:['首页','爆爆团','订单','我的']
        }
    },
    methods:{
        choose(index){
            this.cIndex=index
        }
    }
}
</script>

<style lang="scss" scoped>
.tabbar{
    display: flex;
    justify-content: space-between;
    margin-top: 7vw;
    padding: 0 4vw;
}
.tabbar span{
    font-size: 4vw;
    color: gray;
}
.colorful{
    color: aqua !important;
}
</style>